import Vue from "vue";
import VueRouter from "vue-router";
import store from "@/store";
// 引入组件
const Home = () => import('@pages/Home')
const Login = () => import('@pages/Login')
const Register = () => import('@pages/Register')
const Search = () => import('@pages/Search')
const Detail = () => import('@pages/Detail')
const AddCartSuccess = () => import('@pages/AddCartSuccess')
const ShopCart = () => import('@pages/ShopCart')
const Center = () => import('@pages/Center')
const Pay = () => import('@pages/Pay')
const PaySuccess = () => import('@pages/PaySuccess')
const Trade = () => import('@pages/Trade')
const TeamOrder=()=>import('@pages/Center/TeamOrder')
const MyOrder=()=>import('@pages/Center/MyOrder')
// 重新VueRouter中的push方法
const LastPush = VueRouter.prototype.push
// 原来的push接受3个值 
VueRouter.prototype.push = function (
  location,
  onComplete = () => { },
  onAbort = () => { }
) {
  // 需要修改this的执行为VueRouter的this 
  return LastPush.call(this, location, onComplete, onAbort)
}
Vue.use(VueRouter)
const router = new VueRouter({
  scrollBehavior() {
    return {
      x: 0,
      y: 0
    }
  },
  model: 'history',
  routes: [
    { path: '/home', component: Home, name: 'home', meta: { isNav: true } },
    {
      path: '/login', component: Login, name: 'login', meta: { isShow: true }, beforeEnter(to, from, next) {
        // 如果有token就不让你登录
        if (store.state.user.token) {
          next('/home')
        } else {
          next()
        }
      }
    },
    { path: '/register', component: Register, name: 'register', meta: { isShow: true } },
    { path: '/search/:keyword?', component: Search, name: 'search' },
    { path: '/detail/:skuId', component: Detail, name: 'detail' },
    {
      path: '/addCartSuccess', component: AddCartSuccess, name: 'addCartSuccess', beforeEnter(to, from, next) {
        if (sessionStorage.getItem("shopCarData")) {
          next()
        } else {
          next('/shopCart')
        }
      }
    },
    { path: '/shopCart', component: ShopCart, name: 'shopCart' },
    {
      path: '/center', component: Center, name: 'center',
      children: [
        { path: 'myOrder', component: MyOrder, name: 'myOrder' },
        { path: 'teamOrder', component: TeamOrder, name: 'teamOrder', },
        { path: '', redirect: "/center/myOrder" }
      ]
    },
    {
      path: '/pay', component: Pay, name: 'pay', beforeEnter(to, from, next) {
        if (from.path.startsWith("/trade")) {
          next();
        } else {
          next("/shopcart");
        }
      },
    },
    {
      path: '/paySuccess', component: PaySuccess, name: 'paySuccess', beforeEnter(to, from, next) {
        if (from.path.startsWith("/pay")) {
          next();
        } else {
          next("/shopcart");
        }
      },
    },
    {
      path: '/trade', component: Trade, name: 'trade', beforeEnter(to, from, next) {
        if (from.path.startsWith("/shopcart")) {
          next();
        } else {
          next("/shopcart");
        }
      },
    },
    { path: '/', redirect: '/home' }
  ]
})
// 全局前置守卫 每次路由跳转的时候都会校验
router.beforeEach(async (to, from, next) => {
  // to:要去的路由对象
  // from:来源的路由对象
  // next:决定下一步的操作
  //  -next():直接放行.去往to的路由地址
  //  -next("/路径"):不再去往to的地址,而是去往next规定的地址
  // 使用一个数组,保存所有必要要有token才能访问的路由地址
  const checkPath = ["/center", "/pay", "/paysuccess", "/trade"]
  // 查看要去的路由中的地址是否在限制中 startsWith判断to路径是否开头为item
  const isCheckPath = checkPath.some(item => to.path.startsWith(item))
  // 获取VueX中的token和用户名
  const token = store.state.user.token;
  const nickName = store.state.user.nickName;
  // 如果有用户名
  if (nickName) {
    return next()
  }
  // 如果没有用户名 就再判断去的路由需不需要权限校验
  if (isCheckPath) {
    // 如果有token 就获取用户名 并放行
    if (token) {
      try {
        //dispatch方法的返回值就是这个actions方法的返回值
        await store.dispatch("user/getUserName");
        next();
      } catch (e) {
        next("/login");
      }
    }
    // 如果没有token,就说明没有登录直接去登录页登录
    else {
      next("/login");
    }
  } else {
    // 如果不需要权限校验 且有token的情况下 获取用户名
    if (token) {
      try {
        //dispatch方法的返回值就是这个actions方法的返回值
        await store.dispatch("user/getUserName");
        next();
      } catch (e) {
        next("/login");
      }
    }
    next()
  }
})

export default router